@import 'base_colors.scss';
@import '_functions.scss';

/*!
	消息列表
	2020-04-02
	2021-07-13
	2021-07-31
*/

$mclr: #069;
$eclr: #f61a42;
$iclr: #0f9ef2;

$iclr: fun_clr($mclr,#00f,80%);

@mixin msg_type($type,$file,$clr_p) {
	&-tp-#{$type} {
		background-color: fun_clr_white(fun_clr($iclr,$eclr,$clr_p),40%);
		box-shadow: fun_clr($iclr,$eclr,$clr_p) 0 0 2px;

		.l-msg-title {
			/*background-color: fun_clr($iclr,$eclr,$clr_p);
			background-image: url('Images/#{$file}.png');*/
			background: url('Images/#{$file}.png') 6px center no-repeat, linear-gradient(0deg, fun_clr($iclr,$eclr,$clr_p) 42%, fun_clr_white(fun_clr($iclr,$eclr,$clr_p),70%) 58%, fun_clr($iclr,$eclr,$clr_p) 100% ) left center no-repeat;
			background-size: 22px 22px, auto auto;
		}
	}
}

.l-msg-list {
	box-sizing: border-box;
	padding-top: 0px;
	position: fixed;
	top: 0px;
	/*right: 0px;
	min-width: 300px;
	margin: 0 auto;*/
	width: 100%;
	pointer-events: none;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif, 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
	line-height: 26px;
	font-size: 14px;
	z-index: 20000;
	opacity: 0.9;

	.l-msg-container {
		margin: 0 auto;
		overflow: hidden;

		.l-msg {
			pointer-events: all;
			box-sizing: border-box;
			display: none;
			width: 341px;
			margin: 10px auto 2px auto;
			border: solid 2px #fff;
			box-shadow: fun_clr($iclr,$eclr,90%) 0 0 2px;
			background-color: fun_clr_white($iclr,50%);
			border-radius: 5px;
			cursor: default;

			div {
				text-align: left;
			}

			.l-msg-title {
				padding: 3px 3px 3px 35px;
				/*font-weight: bold;*/
				min-height: 26px;
				line-height: 24px;
				color: #fff;
				border-radius: 5px 5px 0 0;
				background: $iclr;

				.btn-close {
					cursor: pointer;
					display: inline-block;
					float: right;
					box-shadow:  #f9f9f9 0 0 2px 0px;
					padding: 0 5px;
					border-radius: 4px;
					&:hover {
						box-shadow: #f9f9f9 0 0 5px 0px;
					}
				}
			}

			.l-msg-text {
				padding: 3px 15px;
				min-height: 32px;
				overflow-wrap: break-word;
			}

			@include msg_type('info','info',90%);
			@include msg_type('prompt','info',70%);
			@include msg_type('warning','alarm',50%);
			@include msg_type('alarm','alarm',30%);
			@include msg_type('error','error',10%);
		}
	}
}
/*!
	加载蒙版层
*/
.l-loading-container {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 10001;
	display: none;
	text-align: center;

	> div {
		&.l-loading-mask {
			position: fixed;
			left: 0;
			top: 0;
			opacity: .2;
			background-color: #808080;
			width: 100%;
		}

		&.l-loading-msg {
			box-sizing: border-box;
			padding: 5px 20px;
			text-align: center;
			border: solid 2px #fff;
			box-shadow: $iclr 0 0 2px;
			border-radius: 5px;
			background-color: $iclr;
			color: #fff;
			font-size: 16px;
			line-height: 28px;
			display: inline-block;
		}
	}
}
